* {
    margin: 0;
    padding: 0;
  }
.box{
    width: 200px;
    height: 200px;
    border: 1px solid #000;
    margin: 150px auto;
    background-color: skyblue;
    animation: move 5s linear infinite;
}
@keyframes move {
    0% {
        transform:translate(0);
    }
    25% {
        transform:translateX(500px);
    }
    50% {
        transform:translateX(500px) translateY(500px);
    }
    75% {
        transform:translateX(0) translateY(500px);
    }
    100% {
        transform:translate(0);
    } 
}